<template>
  <div>
    <Header>
      <template v-slot:left>
        <span class="iconfont icon-saoma"></span>
      </template>
      <template v-slot:center>
        <div class="search">
            <span class="iconfont icon-sousuo"></span>
        </div>
      </template>
      <template v-slot:right>
        <span class="iconfont icon-dingdan"></span>
      </template>
    </Header>
    首页
  </div>
</template>

<script>
import Header from "../components/header.vue";
export default {
  data() {
    return {};
  },

  components: {
    Header,
  },

  methods: {},
};
</script>

<style scoped lang='scss'>
.icon-saoma{
    font-size: 0.5rem;
    color: #fff;
    opacity: .5;
}
.search{
    width: 5rem;
    height: 0.56rem;
    border-radius: 0.05rem;
    background-color: #dd3000;
    display: flex;
    align-items: center;
    padding-left: 0.1rem;
    .icon-sousuo{
        font-size: 0.36rem;
        color: #e55e38;
    }
}
.icon-dingdan{
    font-size: 0.5rem;
    color: #ffab85;
}
</style>
